{
	template:`
    <m-page>
        <template #bar>
            <div class="cu-bar tabbar bg-white foot">
                <div class="action text-blue">
                    <div class="cuIcon-homefill"></div> 首页
                </div>
                <div class="action text-gray add-action" @click="$refs.menu.open()">
                    <button class="cu-btn cuIcon-apps bg-gradual-blue shadow"></button>
                    全部功能
                </div>
                <div v-if="user" class="action text-gray" @click="$refs.info.open()">
                    <div class="cuIcon-people"></div> 信息
                </div>
                <div v-else class="action text-gray" @click="toLogin()">
                    <div class="cuIcon-people"></div> 登录
                </div>
            </div>
        </template>
        <div class="flex" style="margin-bottom:-160px;background-image:linear-gradient(#0081ff55, #0081ff00);">
            <div class="flex-sub"></div>
            <img style="width:200px;" src="resources/img/head.png"></img>
        </div>
        <div v-if="user" class="padding flex align-center">
            <div class="cu-avatar round lg bg-blue">{{user.realName.substring(0,1)}}</div>
            <div class="flex-sub padding-left-sm">
                <div class="text-xl">你好！{{user.realName}}</div>
                <div>{{business.name}} - {{store.name}}</div>
            </div>
        </div>
        <div v-else class="padding" @click="toLogin">
            <div class="padding-tb-sm text-xxl">你好！</div>
            <div class="text-blue">点击登录 -></div>
        </div>
        <m-title>店铺统计（{{indexData.month.month}}）</m-title>
        <div class="padding-sm">
            <m-grid :col="3">
                <m-desc innerClass="bg-olive light padding-xs radius">
                    <template #title>
                        <div style="margin-bottom:-10px;" class="text-black"><m-icon name="wenjianzhengzhaoyinzhangwaijie">订单</m-icon></div>
                    </template>
                    <div class="text-right text-blue">{{formatNum(indexData.month.orderNum)}}<small>单</small></div>
                    <div class="text-right text-blue">{{formatAmount(indexData.month.orderAmount)}}<small>元</small></div>
                </m-desc>
                <m-desc innerClass="bg-green light padding-xs radius">
                    <template #title>
                        <div style="margin-bottom:-10px;" class="text-black"><m-icon name="jiaqinleixing">计划</m-icon></div>
                    </template>
                    <div class="text-right text-blue">{{formatNum(indexData.month.planAmount)}}<small>元</small></div>
                    <div class="text-right text-blue"><small>已完成</small>{{formatAmount(indexData.month.completionRate)}}<small>%</small></div>
                </m-desc>
                <m-desc innerClass="bg-cyan light padding-xs radius">
                    <template #title>
                        <div style="margin-bottom:-10px;" class="text-black"><m-icon name="gongzitiaoguanli">充值</m-icon></div>
                    </template>
                    <div class="text-right text-blue">{{formatNum(indexData.month.rechargeNum)}}<small>单</small></div>
                    <div class="text-right text-blue">{{formatAmount(indexData.month.rechargeAmount)}}<small>元</small></div>
                </m-desc>
            </m-grid>
        </div>
        <m-title>常用功能
			<template #action>
				<div @click="openMyMenu()" class="padding-lr-sm">
					<div class="cuIcon-settingsfill text-blue text-lg"></div>
				</div>
			</template>
        </m-title>
		<m-card>
			<div class="grid col-3">
				<template v-for="group in menus">
					<template v-for="item in group.menus">
                        <template v-if="isMyMenu(item.oid)">
                            <div @click="toPage(item.path)" style="width:33.33%;">
                                <index-link :icon="item.icon" :title="item.name" :desc="item.description"></index-link>
                            </div>
                        </template>
					</template>
				</template>
			</div>
		</m-card>
        <m-title v-if="indexData.PowerStore">店铺待办</m-title>
        <m-top v-if="indexData.PowerStore"></m-top>
		<m-card v-if="indexData.PowerStore" color="orange" join light>
		    <div class="flex align-center">
                <div class="padding-lr text-center">
                    <m-icon name="wenjianzhengzhaoyinzhangwaijie"></m-icon>
                    <div>订单</div>
                </div>
                <div class="padding-xs flex-sub">
                    <m-grid :col="2">
                        <m-desc @click="toPage('order/checkOrderInfoList.js')" innerClass="bg-gray padding-lr-sm padding-tb-xs radius">
                            <template #title><div style="margin-bottom:-10px;" class="text-blue">待审核</div></template>
                            <div class="text-right"><span class="text-blue text-lg padding-right-xs">{{formatNum(indexData.order.confirmNum)}}</span><small>单</small></div>
                            <div class="text-right"><span class="text-blue text-lg padding-right-xs">{{formatAmount(indexData.order.confirmAmount)}}</span><small>元</small></div>
                        </m-desc>
                        <m-desc @click="toPage('order/storeOrderInfoList.js')" innerClass="bg-gray padding-lr-sm padding-tb-xs radius">
                            <template #title><div style="margin-bottom:-10px;" class="text-green">已完成</div></template>
                            <div class="text-right"><span class="text-green text-lg padding-right-xs">{{formatNum(indexData.order.doneNum)}}</span><small>单</small></div>
                            <div class="text-right"><span class="text-green text-lg padding-right-xs">{{formatAmount(indexData.order.doneAmount)}}</span><small>元</small></div>
                        </m-desc>
                    </m-grid>
                </div>
            </div>
		</m-card>
		<m-card v-if="indexData.PowerStore" color="red" join light>
		    <div class="flex align-center">
                <div class="padding-lr text-center">
                    <m-icon name="gongzitiaoguanli"></m-icon>
                    <div>充值</div>
                </div>
                <div class="padding-xs flex-sub">
                    <m-grid :col="2">
                        <m-desc @click="toPage('order/checkMemberRechargeList.js')" innerClass="bg-gray padding-lr-sm padding-tb-xs radius">
                            <template #title><div style="margin-bottom:-10px;" class="text-blue">待审核</div></template>
                            <div class="text-right"><span class="text-blue text-lg padding-right-xs">{{formatNum(indexData.recharge.confirmNum)}}</span><small>单</small></div>
                            <div class="text-right"><span class="text-blue text-lg padding-right-xs">{{formatAmount(indexData.recharge.confirmAmount)}}</span><small>元</small></div>
                        </m-desc>
                        <m-desc @click="toPage('order/storeMemberRechargeList.js')" innerClass="bg-gray padding-lr-sm padding-tb-xs radius">
                            <template #title><div style="margin-bottom:-10px;" class="text-green">已完成</div></template>
                            <div class="text-right"><span class="text-green text-lg padding-right-xs">{{formatNum(indexData.recharge.doneNum)}}</span><small>单</small></div>
                            <div class="text-right"><span class="text-green text-lg padding-right-xs">{{formatAmount(indexData.recharge.doneAmount)}}</span><small>元</small></div>
                        </m-desc>
                    </m-grid>
                </div>
            </div>
		</m-card>

		<m-modal ref="menu" :title="showSetMenu?'设置常用功能':'全部功能'" @close="closeMyMenu()">
			<template #action>
				<m-button v-if="showSetMenu" @click="saveMyMenu(setMenu)">保存</m-button>
				<div v-else class="text-blue" @click="setShowSetMenu(true)">编辑常用功能</div>
			</template>
			<m-card v-if="showSetMenu" light color="orange">
				<div class="padding">
					点击下面菜单设置，设置完成后请点击保存。
				</div>
			</m-card>
			<m-top v-else></m-top>
			<template v-for="group in menus">
                <m-title>{{group.group}}</m-title>
                <m-card>
                    <m-grid :col="3" :items="group.menus">
                        <template #item="{item}">
                            <div v-if="showSetMenu" @click="toggleSetMenu(item.oid)" :class="[isSetMenu(item.oid)?'bg-blue':'']" class="light">
                                <index-link :icon="item.icon" :title="item.name" :desc="item.description"></index-link>
                            </div>
                            <div v-else @click="toPage(item.path)">
                                <index-link :icon="item.icon" :title="item.name" :desc="item.description"></index-link>
                            </div>
                        </template>
                    </m-grid>
                </m-card>
			</template>
		</m-modal>
		<m-modal ref="info" title="信息">
			<div v-if="user">
				<m-card>
					<m-cell>
						<template #icon>
							<div class="cu-avatar round lg bg-blue">{{user.realName.substring(0,1)}}</div>
						</template>
						<div class="text-lg">{{user.realName}} <span class="text-sm">{{user.phoneNum}}</span></div>
						<div class="text-sm">{{business.name}} - {{store.name}}</div>
					</m-cell>
					<m-cell v-if="user.powers.length">
						<div v-if="user.powers.indexOf('A')>=0" class="cu-tag radius light bg-green">管理</div>
						<div v-if="user.powers.indexOf('B')>=0" class="cu-tag radius light bg-orange">店长</div>
					</m-cell>
					<m-cell @click="$refs.modPas.open()">
						<template #icon><div class="cuIcon-command text-blue"></div></template>
						修改密码
						<template #action><div class="cuIcon-right"></div></template>
					</m-cell>
				</m-card>
				<m-card join>
					<m-cell @click="logout()">
						<template #icon><div class="cuIcon-exit text-blue"></div></template>
						退出登录
						<template #action><div class="cuIcon-right"></div></template>
					</m-cell>
				</m-card>
			</div>
		</m-modal>
		<m-modal ref="modPas" :drawer="false" title="修改密码">
            <m-card>
                <div class="cu-form-group">
                    <div class="title text-red">原密码</div>
                    <m-input v-model="modPas.oldPassword" placeholder="请输入原密码"></m-input>
                </div>
                <div class="cu-form-group">
                    <div class="title text-red">新密码</div>
                    <m-input v-model="modPas.newPassword" placeholder="请输入新密码"></m-input>
                </div>
            </m-card>
            <div class="flex padding-lr-sm padding-bottom">
                <div class="flex-sub flex flex-direction padding-lr-xs">
                    <m-button @click="$refs.modPas.close()" line>关闭</m-button>
                </div>
                <div class="flex-sub flex flex-direction padding-lr-xs">
                    <m-button @click="savePassword">修改</m-button>
                </div>
            </div>
		</m-modal>
    </m-page>
	`,
	props: ['param','parentVue'],
	data:function(){
		return {
		    user:null,
		    password:"",
		    business:null,
		    store:null,
		    menus:[],
            myMenu:[],
            setMenu:[],
            showSetMenu:false,
            indexData:{
                PowerStore:true,
                PowerManage:true,
                order:{},
                recharge:{},
                month:{month:'月度'}
            },
            modPas:{
                oldPassword:'',
                newPassword:'',
            }
		};
	},
	mounted(){
        this.user=config.user;
        this.business=config.business;
        this.store=config.store;
        this.requestData('action/base/page/menus',
            {},
            (data)=>{
                if(data.code==0){
                    this.menus=data.menus;
                    if(this.user&&this.user.menus&&this.user.menus.length){
                        this.myMenu=this.user.menus;
                    }else{
                        this.myMenu=['1010','1020','2020'];
                    }
                    this.closeMyMenu();
	                this.getIndexData();
                }else{
                    this.remind('red',data.msg);
                }
            }
        );
	},
	methods:{
        closeModule:function(){
            this.$refs.menu.close();
            this.closeMyMenu();
        },
        openMyMenu:function(){
            if(this.user){
                this.$refs.menu.open();
                this.setShowSetMenu(true);
            }else{
                this.remind().error("未登录");
            }
        },
        setShowSetMenu:function(b){
            if(this.user){
                this.showSetMenu=b;
            }else{
                this.remind().error("未登录");
            }
        },
        closeMyMenu:function(){
            this.showSetMenu=false;
            this.setMenu=[...this.myMenu];
        },
        toggleSetMenu:function(key){
            for(let i=0;i<this.setMenu.length;i++){
                if(key==this.setMenu[i]){
                    if(this.setMenu.length<=3){
                        this.remind().error("至少要设置三个常用菜单！");
                        return;
                    }
                    this.setMenu.splice(i, 1);
                    return;
                }
            }
            this.setMenu.push(key);
        },
        savePassword:function(){
            if(this.user){
                this.requestData('action/base/userInfo/savePassword',
                    {oldPassword:this.modPas.oldPassword,newPassword:this.modPas.newPassword},
                    (data)=>{
                        if(data.code==0){
                            this.remind().success(data.msg);
                            this.modPas.oldPassword="";
                            this.modPas.newPassword="";
                            this.$refs.modPas.close();
                        }else{
                            this.remind().error(data.msg);
                        }
                    }
                );
            }else{
                this.remind().warn("未登录！");
            }
        },
        saveMyMenu:function(menus){
            if(this.user){
                this.requestData('action/base/userInfo/saveMenus',
                    {menus:menus},
                    (data)=>{
                        if(data.code==0){
                            this.remind().success(data.msg);
                            this.user.menus=menus;
                            this.myMenu=menus;
                            this.closeModule();
                        }else{
                            this.remind().error(data.msg);
                        }
                    }
                );
            }else{
                this.remind().warn("未登录，无法保存常用菜单！");
            }
        },
        isMyMenu:function(key){
            for(let i=0;i<this.myMenu.length;i++){
                if(key==this.myMenu[i]) return true;
            }
            return false;
        },
        isSetMenu:function(key){
            for(let i=0;i<this.setMenu.length;i++){
                if(key==this.setMenu[i]) return true;
            }
            return false;
        },
	    toLogin:function(){
	        this.openPage('base/login.js',{},(flag)=>{
	            if(flag){
                    location.reload();
	            }
	        });
	    },
	    toPage:function(path){
	        this.openPage(path,{},()=>{
                this.getIndexData();
	        });
	    },
	    getIndexData:function(){
	        if(this.user){
                this.requestData('action/base/page/index',{},(json)=>{
                    if(json.code==0){
                        this.indexData=json.data;
                    }
                });
	        }
	    },
        logout:function(){
            this.confirm('退出登录','确定要退出登录吗？',()=>{
                this.requestData('action/base/userInfo/logout',{},(json)=>{
                    if(json.code==0){
                        location.reload();
                    }
                });
            });
        }
	}
}